import React, { useState, useEffect } from 'react';
import { history } from 'umi';
import './market.less'; //公共样式 书写布局的
import './market_2.css'; //内部样式的书写
import Ec1 from './echarts1/Ec1';
import Ec2 from './echarts2/Ec2';
import Ec3 from './echarts3/Ec3';
import Ec4 from './echarts4/Ec4';
import Ec5 from './echarts5/Ec5';
import EchartsTable from './echartsTable/EchartsTable';

type Props = {};

export default function Market() {
  return (
    <div className="market">
      <div className="echarts1">
        <div className="div1">
          {/* 第一个图头部标题区域 */}
          <div className="echarts1_top">
            <span className="echarts1_top_spn1">客户来源统计</span>
            <span className="echarts1_top_spn2">
              <img
                src={
                  'https://erpdemo.fanpusoft.com/res/themes/Custom_ERP/more_bg.gif'
                }
                alt=""
                onClick={() => {
                  history.push('/echarts1');
                }}
              />
            </span>
          </div>
          {/* 存放得echarts图表区域 */}
          <Ec1></Ec1>
        </div>
        <div className="div2">
          <div className="echarts1_top">
            <span className="echarts1_top_spn1">领用人员分布</span>
            <span className="echarts1_top_spn2">
              <img
                src={
                  'https://erpdemo.fanpusoft.com/res/themes/Custom_ERP/more_bg.gif'
                }
                alt=""
                onClick={() => {
                  history.push('/echarts2');
                }}
              />
            </span>
          </div>
          {/* 存放得echarts2图表区域 */}
          <Ec2></Ec2>
        </div>
        <div className="div3">
          <div className="echarts1_top">
            <span className="echarts1_top_spn1">价值评估统计</span>
            <span className="echarts1_top_spn2">
              <img
                src={
                  'https://erpdemo.fanpusoft.com/res/themes/Custom_ERP/more_bg.gif'
                }
                alt=""
                onClick={() => {
                  history.push('/echarts3');
                }}
              />
            </span>
          </div>
          <Ec3></Ec3>
        </div>
      </div>
      <div className="echarts2">
        <div
          onClick={() => {
            history.push('/echarts4');
          }}
          className="div4"
        >
          <div className="echarts2_top">
            <span className="echarts2_top_spn1">客户分类统计</span>
            <span className="echarts2_top_spn2">
              <img
                src={
                  'https://erpdemo.fanpusoft.com/res/themes/Custom_ERP/more_bg.gif'
                }
                alt=""
                onClick={() => {
                  history.push('/echarts4');
                }}
              />
            </span>
          </div>
          <Ec4></Ec4>
        </div>
        <div
          onClick={() => {
            history.push('/echarts5');
          }}
          className="div5"
        >
          <div className="echarts2_top">
            <span className="echarts2_top_spn1">客户区域统计</span>
            <span className="echarts2_top_spn2">
              <img
                src={
                  'https://erpdemo.fanpusoft.com/res/themes/Custom_ERP/more_bg.gif'
                }
                alt=""
                onClick={() => {
                  history.push('/echarts5');
                  console.log(111);
                }}
              />
            </span>
          </div>
          <Ec5></Ec5>
        </div>
      </div>
      <div className="markettable">
        <EchartsTable></EchartsTable>
      </div>
    </div>
  );
}
